<%--
  Created by IntelliJ IDEA.
  User: xwj32
  Date: 2023-05-22
  Time: 15:31
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>预约成功</title>
    <link rel="stylesheet" href="https://cdn.bootcdn.net/ajax/libs/bootstrap/5.0.2/css/bootstrap.min.css"/>
    <style>
        body {
            background-color: #fdfbfb;
            font-family: 'Lato', sans-serif;
        }
        h2 {
            color: #4d4d4d;
            font-weight: bold;
            font-size: 3rem;
        }
        .card {
            border-radius: 20px;
            box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
            padding: 40px;
            text-align: center;
        }
        .countdown-timer,
        .countdown-timer p {
            display: inline-block;
        }
        .countdown-timer {
            font-size: 1.5rem;
            color: #4d4d4d;
        }
        .countdown-timer p {
            margin: 0;
            font-weight: bold;
            font-size: 2rem;
        }
        .success-text {
            font-size: 2rem;
            color: #4d4d4d;
            margin: 30px 0;
        }
    </style>
</head>
<body>
<div class="container">
    <div class="row justify-content-center align-items-center">
        <div class="col-md-6">
            <div class="card">
                <h2>预约成功</h2>
                <p class="success-text">
                    感谢您的预约，我们将尽快与您联系确认。
                </p>
                <!-- 显示倒计时 -->
                <div class="countdown-timer">
                    <p>3</p>
                    <p>秒后自动返回主页</p>
                </div>
            </div>
        </div>
    </div>
</div>
<script>
    var count = 3;
    setInterval(function(){
        count--;
        if(count==0){
            window.location.href="<%=request.getContextPath()%>/index.jsp";
        }else{
            document.querySelector(".countdown-timer P:first-child").textContent=count;
        }
    },1000);
    //   var count = 3; // 设定倒计时时间
    //   setInterval(function () {
    // count--;
    // if (count === 0) {
    当倒计时结束时
    //   window.location.href = "/"; // 跳转到主页
    // } else {
    更新倒计时剩余时间
    //   document.querySelector(".countdown-timer p:first-child").textContent =
    // count;
    // }
    //   }, 1000);
</script>
</body>
</html>
